<script setup lang="ts">
import { UserDropdown } from '@vben/layouts';
import { useAccessStore, useUserStore } from '@vben/stores';
import { preferences } from '@vben/preferences';
import { computed } from "vue"
import { useRouter } from 'vue-router';
import loginTitle from "#/assets/login-title.png"
const userStore = useUserStore();

defineOptions({ name: 'Home' });
const router = useRouter();
const handleLogout = () => { 
  router.push('/auth/login')
}
const menus = computed(() => [])
const avatar = computed(() => {
  return userStore.userInfo?.avatar ?? preferences.app.defaultAvatar;
});
</script>
<template>
  <div class="flex flex-col h-full">
    <div class="flex items-center justify-between">
      <div class="auth-title flex items-center h-[80px] pr-[20px] pl-[20px]">
        <img :src="loginTitle" alt="" class="">
        <span class="font-bold text-2xl">国家工业软件产教融合共同体</span>
      </div>
      <div>
        <UserDropdown :avatar :menus text="游客" description="yike@qq.com" tag-text="Pro" @logout="handleLogout" />
      </div>
    </div>
    <RouterView class="h-full flex-auto bg-[#f4f5f5] pr-[60px] pl-[60px] pt-[15px] pb-[60px]"></RouterView>
  </div>


</template>
